<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>活动页面</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<!--标准mui.css-->
		<link href="css/mui.min.css" rel="stylesheet" />
		<!--App标准自定义的css-->
		<link rel="stylesheet" href="css/default.css" />
		<!--App自定义的css-->
		<link rel="stylesheet" href="css/activity.css" />
		<!--App默认样式-->
		<link rel="stylesheet" href="css/default.css" />
		<!--引人jquery-->
		<script type="text/javascript" src="js/jquery-2.1.0.js" ></script>
		<script type="text/javascript" src="js/nav.js"></script>
	</head>

	<body style="background-color: #fff;">
		<!--搜索框-->
		<div class="mui-input-row mui-search">
		    <input type="search" class="mui-input-clear" placeholder="搜索">
		</div>
		<!--轮播图-->
            <div class="mui-slider">
                <!--轮播图片-->
                <div class="mui-slider-group mui-slider-loop">
                    <!--支持循环，需要重复图片节点-->
                    <div class="mui-slider-item mui-slider-item-duplicate">
                        <a href="#">
                            <img src="image/item2.png" />
                        </a>
                    </div>  
                    
                     <div class="mui-slider-item">
                         <a href="#">
                             <img src="image/item1.png" />
                         </a>
                     </div>
                     <div class="mui-slider-item">
                        <a href="#">
                            <img src="image/item2.png" />
                        </a>
                    </div>
                    
                        <!--支持循环，需要重复图片节点-->
                        <div class="mui-slider-item mui-slider-item-duplicate">
                         <a href="#">
                             <img src="image/item1.png" />
                         </a>
                     </div>
                </div>
                
                <!--显示圆点-->
                <div class="mui-slider-indicator">
                     <div class="mui-indicator mui-active"></div>
                     <div class="mui-indicator"></div>
                </div>
            </div>
            
            <!--九宫格-->
            <div class="branchClass">
            	<div class="branchClass-itme">
            		<img src="icon/branClass2.png" />
            		<span>类别一</span>
            	</div>
            	<div class="branchClass-itme">
            		<img src="icon/branClass1.png" />
            		<span>类别二</span>
            	</div>
            	<div class="branchClass-itme">
            		<img src="icon/branClass3.png" />
            		<span>类别三</span>
            	</div>
            	<div class="branchClass-itme">
            		<img src="icon/branClass4.png" />
            		<span>类别四</span>
            	</div>
           
            </div>
            <!--列表-->
            <!--<ul class="mui-table-view">
    <li class="mui-table-view-cell mui-media">
         <a href="activityLsit.html">
            <img class="mui-media-object mui-pull-left list-img" src="image/item2.png">
            <div class="mui-media-body">
                <span class="list-supTitle">活动标题活动标题活动标题活动标题活动标题活动标题活动标题活动标题活动标题活动标题</span>
                <p class='mui-ellipsis'>活动时间：<i>2019-03-13</i></p>
                 <div class="btn-box">
                 	<button class="jojinBtn">我要参与</button>
                 </div>
            </div>
        </a>
    </li>
    <li class="mui-table-view-cell mui-media">
        <a href="activityLsit.html">
            <img class="mui-media-object mui-pull-left" src="image/slider1.jpg">
            <div class="mui-media-body">
                <span class="list-supTitle">动标题活动标题</span>
                <p class='mui-ellipsis'>活动时间：<i>2019-03-13</i></p>
               <div class="btn-box">
               	 <button class="jojinBtn">我要参与</button>
               </div>
            </div>
        </a>
    </li>
    <li class="mui-table-view-cell mui-media">
        <a href="activityLsit.html">
            <img class="mui-media-object mui-pull-left" src="image/item1.png">
            <div class="mui-media-body">
                <span class="list-supTitle">活动标题活动标题活动标题活动标题活动标题</span>
                <p class='mui-ellipsis'>活动时间：<i>2019-03-13</i></p>
               <div class="btn-box">
               	  <button class="jojinedBtn">已参与</button>
                 <button class="cancel">取消</button>
               </div>
            </div>
        </a>
    </li>
</ul>-->
      <!--图片列表-->
      <div class="imgList">
      	<a href="activityLsit.html">
	      	<div class="imgList-item">
	      		<img class="item-img" src="image/activeImg01.png" />
	      		<span class="item-text">消费贷</span>
	      	</div>
      	</a>
      	<a href="activityLsit.html">
	      	<div class="imgList-item">
	      		<img class="item-img"  src="image/activeImg02.png" />
	      		<span class="item-text">消费贷</span>
	      	</div>
      	</a>
      	<a href="activityLsit.html">
	      	<div class="imgList-item">
	      		<img class="item-img"  src="image/activeImg03.png" />
	      		<span class="item-text">消费贷</span>
	      	</div>
	     </a>
	     <a href="activityLsit.html">
	      	<div class="imgList-item">
	      		<img class="item-img"  src="image/activeImg04.png" />
	      		<span class="item-text">消费贷</span>
	      	</div>
      	</a>
      	<a href="activityLsit.html">
	      	<div class="imgList-item">
	      		<img class="item-img"  src="image/activeImg05.png" />
	      		<span class="item-text">消费贷</span>
	      	</div>
	    </a>
	    <a href="activityLsit.html">
	      	<div class="imgList-item">
	      		<img class="item-img"  src="image/activeImg06.png" />
	      		<span class="item-text">消费贷</span>
	      	</div>
	    </a>  	
	    <a href="activityLsit.html">
	      	<div class="imgList-item">
	      		<img class="item-img"  src="image/activeImg07.png" />
	      		<span class="item-text">消费贷</span>
	      	</div>
	    </a> 
	    <a href="activityLsit.html">
	      	<div class="imgList-item">
	      		<img class="item-img"  src="image/activeImg08.png" />
	      		<span class="item-text">消费贷</span>
	      	</div>
	    </a>  	
      </div>
	<!--导航-->
 <div class="bottonNav nav-cont" id="navCont">
            	<a href="index.html" class="nav-cont-itme" >
            		<img src="icon/shouye.png" class="navImg"/>
            		<span>首页</span>
            	</a>
            	<a href="activity.html" class="nav-cont-itme" >
            		<img src="icon/huodong.png" class="navImg"/>
            		<span>活动</span>
            	</a>
            	<a href="gameCenter.html" class="nav-cont-itme" >
            		<img src="icon/youxi.png" class="navImg"/>
            		<span>游戏</span>
            	</a>
            	<a href="shoppingMall.html" class="nav-cont-itme" >
            		<img src="icon/shangcheng.png" class="navImg"/>
            		<span>商城</span>
            	</a>
            	<a href="inforCenter.html" class="nav-cont-itme" >
            		<img src="icon/wode.png" class="navImg"/>
            		<span>我的</span>
            	</a>
            </div>
   <div class="sated"></div>
		<script src="js/mui.min.js"></script>
		<script type="text/javascript">
				mui.init({
                swipeBack:false //启用右滑关闭功能
            });
      	//轮播图
      	var gallery = mui('.mui-slider');
					gallery.slider({
					  interval:1000//自动轮播周期，若为0则不自动播放，默认为0；
					});
		</script>
	</body>

</html>